<template>
  <div class="add-car">
    <el-dialog
      v-el-drag-dialog="{ drag: true, full: true, resize: true }"
      title="品牌添加"
      :close-on-click-modal="false"
      :visible.sync="md.state"
      @close="closeMd"
      v-if="md.state"
      :width="'80%'"
    >
      品牌添加
    </el-dialog>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import elDragDialog from "@/directive/el-drag-dialog";
import UploadImg from "@/components/UploadImg";
import * as commonService from "@/api/services/common.service";

export default {
  name: "AddSign",
  directives: { elDragDialog },
  props: ["state"],
  components: { UploadImg },
  computed: {
    ...mapGetters(["lunitNum", "uname"]),
  },
  data() {
    return {
      md: { state: this.state },
      fm: {
        fname: "addCarFm",
        sb: { load: false, text: "立即添加" },
        ps: {
          cityId: "",
          plateNumShort: "",
          plateNumber: "",
          vehicleType: "",
          brandId: "",
          carColor: "",
        },
        xs: { isShow: false },
      },
    };
  },
  created() {},
  methods: {
    /* 关闭弹框 */
    closeMd() {
      this.$emit("getMdState", false);
    },
    /**
     * 获取-城市列表
     */
    getCitys() {
      const that = this;

      commonService.getCitys({}).then((res) => {
        if (res && res.code == 1) {
          that.cityList = res.data;
        }
      });
    },
    /**
     * 选择城市-获取-城市车牌简写列表
     * @param val 城市id
     */
    selectCtiy(val) {
      const that = this;

      commonService.getPlateNumShort({ id: val }).then((res) => {
        if (res && res.code == 1) {
          that.plateNumShortList = res.data;
        }
      });
    },
    /**
     * 选择车辆类型-获取-对应类型车辆品牌列表
     * @param val 车辆类型
     */
    selectCarType(val) {
      const that = this;

      commonService.getCarBrandList({ carType: val }).then((res) => {
        if (res && res.code == 1) {
          that.carBrandList = res.data;

          // 清空之前所选品牌
          that.fm.ps.brandId = "";
        }
      });
    },

    /**
     * 设置-图片url
     * @param e 上传成功后的服务器图片url
     */
    setImgUrl(e) {
      this.fm.ps[e.name] = e.url;

      if (e.url) {
        this.clearFileValText(e.name);
      } else {
        this.$refs[this.fm.fname].validateField(e.name);
      }
    },
    /**
     * 提交表单
     */
    onSubmit() {
      const that = this;

      that.$refs[that.fm.fname].validate((valid) => {
        if (!valid) {
          that.U.qerror("验证不通过");
          return false;
        } else {
          that.fm.sb.load = true; // 添加按钮禁用效果
          let loading = this.U.qloading("提交中，请稍后..."); // 添加遮罩

          // 添加固定参数

          that.fm.ps.unitNum = this.lunitNum;
          that.fm.ps.cusType = that.fm.ps.cusType.toString();
          // 新增推荐人
          that.fm.ps.recomMan = that.fm.ps.serviceMan;

          adupCompanyCus(that.fm.ps, "save").then((res) => {
            that.fm.sb.load = false; // 取消按钮禁用效果
            that.U.qclose(loading); // 关闭遮罩

            if (!res || res.code != 1) {
              that.U.qerror(res.msg);
            } else {
              that.U.qsuccess(res.msg);

              // 关闭弹框
              that.closeMd();

              // 调用父组件方法-重新加载数据
              that.$emit("reloadDg");
            }
          });
        }
      });
    },
    resetForm() {
      // 重置表单
      this.$refs[this.fm.fname].resetFields();
    },
    /**
     * 清除某个字段的验证信息
     * @param filed 字段名
     */
    clearFileValText(filed) {
      /*当然，你可以打印一下fields*/
      let _field = this.$refs[this.fm.fname].fields;
      _field.map((i) => {
        // 通过prop属性值相同来判断是哪个输入框，比如：要移除prop为'user'
        if (i.prop === filed) {
          // 清除验证信息
          i.clearValidate();

          return false;
        }
      });
    },
    // 验证-手机号是否存在
    checkCustomPhone(rule, value, callback) {
      let that = this;

      if (!value) {
        callback(new Error("请输入客户电话"));
      } else if (!that.FV.isPhone(value)) {
        callback(new Error("手机号为11位数字"));
      } else {
        ckCustomPhone({ phone: value }).then((res) => {
          if (res.code === 1) {
            that.fm.sb.load = true;

            callback();
          } else {
            that.fm.sb.load = false;

            callback(new Error(res.msg));
          }
        });
      }
    },
    /**
     * 输入姓名自动默认公司名称
     * @param name
     */
    fillCompany(name) {
      let that = this;

      if (that.fm.ps.baseUserId.realName) {
        that.fm.ps.unitName = that.fm.ps.baseUserId.realName + "的公司";
      }
    },
  },
};
</script>